<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="UTF-8">
        <title>测试</title>
    </head>

    <body>
        <script type="module">
            import { SDCanvasUtil } from "../dist/SDCanvasUtil.js";

            const canvasUtil = new SDCanvasUtil();
            console.log(canvasUtil);
            document.body.append(canvasUtil.canvas);
            render();

            window.addEventListener('resize', function () {
                console.log(`窗口大小发生变化，画布重绘`);
                render();
            });

            function render() {
                canvasUtil.render();
                setTimeout(() => {
                    canvasUtil.setCoverLedColor('red');

                    canvasUtil.drawCellContainer({
                        rowId: 1,
                        colId: 1,
                        label1: '100元',
                        label2: '10捆',
                        label3: '1000000',
                        bgColor: 'rgb(250, 57, 57)',
                        textColor: '#fff'
                    });

                    canvasUtil.drawCellContainer({
                        rowId: 1,
                        colId: 2,
                        label1: '100元',
                        label2: '5捆',
                        label3: '500000',
                        bgColor: 'rgb(28, 28, 229)',
                        textColor: 'white'
                    });

                    setTimeout(() => {
                        canvasUtil.drawCellContainer({
                        rowId: 1,
                        colId: 2,
                        label1: '100元',
                        label2: '5捆',
                        label3: '500000',
                        bgColor: 'yellow',
                        textColor: 'white'
                    });
                    }, 1000)

                    setTimeout(() => {
                        canvasUtil.clearCellContainer({
                            rowId: 1,
                            colId: 2,
                        });
                    }, 2000);
                }, 1500);
            }


        </script>
    </body>

</html>